<template>
  <div  class="imgSingle clearfloat">
    <div v-for="item in videoList" class="videoBox">
      <img src="../../../../static/images/player.png" @click="playVideo(item)">
    </div>
  </div>
</template>

<script>
  import fileType from '../fileType.js';
  export default {
    name: "videoPreview",
    mixins:[fileType],
    componentName: 'videoPreview',
    props: {
      fileUrl:null
    },
    data(){
      return {
        videoList:[]
      }
    },
    watch:{
      fileUrl:{
        handler(v){
          this.getVideoList()
        },
        deep:true
      },
    },
    methods:{
      playVideo(item){
        window.open(item.fileAbsoluteSavePath)
      },
      getVideoList(){
        this.videoList = []
        if(this.fileUrl){

          this.fileUrl.forEach(item => {
            if(this.isVideo(item.fileSuffix)){
              this.videoList.push(item)
            }
          })
        }
        console.log(this.videoList)
      },
    },
    created(){
      this.getVideoList()
    }
  }
</script>

<style scoped>
  .imgSingle img{width: 100px;height: 100px;margin-right: 10px;margin-bottom: 10px}
</style>
<!--0225-->
